<template>
    <el-drawer title="文件说明模板" size="700px" :close-on-click-modal="false" v-if="dialogVisible" direction="rtl"
        @close="handleCloseDialog" :visible="dialogVisible">
        <el-form :model="ruleForm" :rules="rules" :disabled="disable" ref="ruleForm" class="inputForm" style="width: 700px" label-width="120px" :inline="true">
            <el-form-item label="模板名称" prop="template_name">
                <el-input type="text" v-model="ruleForm.template_name"></el-input>
            </el-form-item>
            <el-form-item label="文件编码" prop="file_encoding">
                <el-input type="text" v-model="ruleForm.file_encoding"></el-input>
            </el-form-item>
            <el-form-item label="起草人" prop="drafter">
                <el-input type="text" v-model="ruleForm.drafter"></el-input>
            </el-form-item>
            <el-form-item label="审核人" prop="auditor">
                <el-input type="text" v-model="ruleForm.auditor"></el-input>
            </el-form-item>
            <el-form-item label="批准人" prop="approver">
                <el-input type="text" v-model="ruleForm.approver"></el-input>
            </el-form-item>

            <el-form-item label="修订次数" prop="revise_count">
                <el-input type="text" v-model="ruleForm.revise_count" oninput="value=value.replace(/[^\d]/g,'')"></el-input>
            </el-form-item>
            <el-form-item label="再版修订" prop="reprint_revision">
                <el-input type="text" v-model="ruleForm.reprint_revision"></el-input>
            </el-form-item>
            <el-form-item label="修订版本" prop="revised_version">
                <el-input type="text" v-model="ruleForm.revised_version"></el-input>
            </el-form-item>
            <el-form-item label="发布部门" prop="publish_branch_id">
                <el-cascader ref="cascader" :options="branchData" :show-all-levels="false"
                    v-model="ruleForm.publish_branch_id"
                    :props="{ emitPath: false, checkStrictly: true, label: 'branch_name', value: 'id', children: 'next_level_data' }"
                    clearable>
                </el-cascader>
            </el-form-item>
            <el-form-item label="起草日期" prop="drafting_date">
                <el-date-picker v-model="ruleForm.drafting_date" type="datetime" placeholder="选择日期时间"
                    value-format="timestamp">
                </el-date-picker>
            </el-form-item>
            <el-form-item label="审核日期" prop="audit_date">
                <el-date-picker v-model="ruleForm.audit_date" type="datetime" placeholder="选择日期时间" value-format="timestamp">
                </el-date-picker>
            </el-form-item>
            <el-form-item label="批准日期" prop="approval_date">
                <el-date-picker v-model="ruleForm.approval_date" type="datetime" placeholder="选择日期时间"
                    value-format="timestamp">
                </el-date-picker>
            </el-form-item>
            <el-form-item label="执行日期" prop="execute_date">
                <el-date-picker v-model="ruleForm.execute_date" type="datetime" placeholder="选择日期时间"
                    value-format="timestamp">
                </el-date-picker>
            </el-form-item>
        </el-form>
        <div class="dialog-footer" style="text-align: center;padding-top: 20px;">
            <el-button @click="handleCloseDialog">取 消</el-button>
            <el-button type="primary" @click="handleClickSubmit">确 定</el-button>
        </div>
    </el-drawer>
</template>

<script>
import { FileTemplateCreate, FileTemplateDetail, FileTemplateUpdate } from '@/api/qms.js';
import { organizationBox } from "@/api/organization";
import { timestamp10 } from "@/utils/mUtils";

export default {
    name: 'fileTemplate',
    components: {  },
    props: ['dialogVisible', 'mode', 'id'],
    data() {
        return {
            ruleForm: {
                "template_name": "", // 模板名称
                "file_encoding": "",// 文件编码
                "drafter": "",// 起草人
                "auditor": "",// 审核人
                "approver": "",// 批准人
                "revise_count": "",// 修订次数
                "reprint_revision": "",// 再版修订
                "revised_version": "",// 修订版本
                "publish_branch_id": "",// 发布部门id
                "drafting_date": "",// 起草日期
                "audit_date": "",// 审核日期
                "approval_date": "",// 批准日期
                "execute_date": "" // 执行日期
            },
            rules: {
                template_name: [
                    { required: true, message: '请输入模板名称', trigger: 'blur' }
                ],
                file_encoding: [
                    { required: true, message: '请输入文件编码', trigger: 'blur' }
                ],
                drafter: [
                    { required: true, message: '请输入起草人', trigger: 'blur' }
                ],
                auditor: [
                    { required: true, message: '请输入审核人', trigger: 'blur' }
                ],
                approver: [
                    { required: true, message: '请输入批准人', trigger: 'blur' }
                ],
                revise_count: [
                    { required: true, message: '请输入修订次数', trigger: 'blur' }
                ],
                reprint_revision: [
                    { required: true, message: '请输入再版修订', trigger: 'blur' }
                ],
                revised_version: [
                    { required: true, message: '请输入修订版本', trigger: 'blur' }
                ],
                
                publish_branch_id: [
                    { required: true, message: '请选择发布部门', trigger: 'change' }
                ],
                drafting_date: [
                    { required: true, message: '请选择起草日期', trigger: 'change' }
                ],
                audit_date: [
                    { required: true, message: '请选择审核日期', trigger: 'change' }
                ],
                approval_date: [
                    { required: true, message: '请选择批准日期', trigger: 'change' }
                ],
                execute_date: [
                    { required: true, message: '请选择执行日期', trigger: 'change' }
                ],
            },
            branchData: []
        };
    },
    computed: {
    disable() {
      return this.mode === 'detail';
    },

  },
    mounted() {
        organizationBox(
            { not_show_first_branch: 1, }
        ).then(res => {
            this.branchData = res.data;
        });
        if (this.mode === 'edit' || this.mode === 'detail') {
            this.getDetail();

        }
    },
    methods: {
        handleCloseDialog() {
            this.$emit('close');
        },
    
        getDetail() {
            FileTemplateDetail({
                id: this.id
            }).then(res => {

                const data = res.data;
                data.revise_count = data.revise_count + "";
                data.drafting_date = data.drafting_date * 1000 || '';
                data.audit_date = data.audit_date * 1000 || '';
                data.approval_date = data.approval_date * 1000 || '';
                data.execute_date = data.execute_date * 1000 || '';
                this.ruleForm = data;
            });
        },
        handleClickSubmit() {
            this.$refs["ruleForm"].validate((valid) => {
                if (!valid) return;
                let _ruleForm = {
                    ...this.ruleForm,
                    revise_count: this.ruleForm.revise_count * 1,
                    drafting_date: timestamp10(this.ruleForm.drafting_date) * 1,
                    audit_date: timestamp10(this.ruleForm.audit_date) * 1,
                    approval_date: timestamp10(this.ruleForm.approval_date) * 1,
                    execute_date: timestamp10(this.ruleForm.execute_date) * 1,

                };
                if (this.mode === 'add') {
                    FileTemplateCreate(_ruleForm).then(res => {
                        if (res.code === 10000) {
                            this.$message({
                                message: "新建成功",
                                type: "success",
                            });
                            this.$emit('close', true);
                        }
                    });
                } else {
                    FileTemplateUpdate(_ruleForm).then(res => {
                        if (res.code === 10000) {
                            this.$message({
                                message: "修改成功",
                                type: "success",
                            });
                            this.$emit('close', true);
                        }
                    });
                }
            });
        }


    },
};
</script>
<style lang="scss" scoped>

    .inputForm {
        .el-input {
            width: 180px !important;
        }

        .el-radio-group,
        .el-select,
        .el-date-editor,
        .el-cascader {
            width: 180px;
        }

        .el-textarea {
            width: 400px
        }

        /deep/ .el-form-item {
            margin-right: 30px !important;
        }
    }

/deep/.inputForm .select-add .el-form-item__content>.select-left {
  padding-right:30px;
  box-sizing: border-box;
  border-radius:4px 0 0 4px;
}

</style>